<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <script src="../../static/js/jquery/jquery.js"></script>
    <script src="../../static/js/jquery-form/vue/vue.js"></script>
    <title>Title</title>

</head>
<body>
<!--    页面模板   -->
<div id="app">
    <div>
        <p>
          {{posted.content}}
        </p>
    </div>

    <div v-for="(reply,index) in posted.replys">
        {{index+1}}楼--{{reply.content}}
        {{reply.createTime}}
    </div>

    <br><input name="content" id="content"> <button @click="reply()">回复</button>
</div>
    <script>
        //获取url上的请求参数
        function getParams() {
            //获取问号及问号后面的内容
            var url = window.location.search;
            var params = new Object();
            if (url.indexOf("?") != -1) {
                //截取问号后面的内容,再使用&分割多个属性
                var arr = url.substr(1).split("&");
                for (var i = 0; i < arr.length; i++) {
                    //使用=分割为keyvalue
                    var keyValue = arr[i].split("=");
                    params[keyValue[0]] = keyValue[1];
                }
            }
            return params;
        }


        var app = new Vue({
            el: '#app', <!-- 获取页面模板 -->
            data: { //vue 渲染模板时需要数据
                posted:{}

            },
            methods:{
                reply:function () {
                    //获取url
                    var content = $('#content').val();
                    var _id = getParams().id;
                    $.get("http://localhost:8080/reply/save",{content:content,postedId:_id},function (data) {
                        if (data.code==200){
                           // window.location.href="http://localhost:8088/views/tieba/input.html";
                            window.location.reload();
                        }
                    })
                }
            },
            mounted:function () {
                //获取url
                var _url = getParams().id;
                console.log(_url);
                var _this = this;
                //发异步请求获取数据
                $.get("http://localhost:8080/posted/get",{id:_url},function (data) {
                    console.log(data);
                    _this.posted = data;
                })
            }
        })
    </script>
</body>
</html>